<script setup>
import WOW from "wow.js";
import {ref, onMounted, reactive, onUpdated, defineProps, watch} from "vue";
import {useRouter, useRoute} from "vue-router";
import {
  orderList,
  tongbu,
  shoucai,
  laiyuan,
  cai,
  kexuan,
  gengxin,
  bixuan,
  guoc,
  neic,
} from "../../api/index";
import {useCounterStore} from "../../pina/index";
import {ElNotification} from "element-plus";
import {h} from "vue";
import fileupload from "../utils/fileupload.vue";
import tuchuan from "../utils/tuchuan.vue";
const store = useCounterStore();
const prop = defineProps({
  msg: String,
  bac: {default: false},
});
const wulu = ref("");
const danhao = ref("");
const danOptions = reactive([
  {label: "国际物流", value: "guo"},
  {label: "国内物流", value: "nei"},
]);
const dangetOrderList = () => {
  if (danhao.value == "guo") {
    guoc({trackingNumber: wulu.value}).then((res) => {
      if (res.code == 200) {
        tableData.a[0] = res.data;
      }
    });
  } else {
    neic({trackingNumber: wulu.value}).then((res) => {
      if (res.code == 200) {
        tableData.a[0] = res.data;
      }
    });
  }
};
const sancs = ref(false);
const handleClose = () => {
  sancs.value = false;
  dialogVisiblex.value = false;
};
const shan = (e, ind) => {
  console.log(e, ind);
  setTimeout(() => {
    let aa = ludanform[ind].orderProductList[0].productImages.split(",");
    aa.forEach((item, index) => {
      if (item.includes(e.response ? e.response.url : e.url)) {
        aa.splice(index, 1);
      }
    });
    ludanform[ind].orderProductList[0].productImages = aa.join(",");
  });
};
const router = useRouter();

const handleSelect = (e) => {
  tiao.status = e;
  getOrderList();
};
const dialogVisible = ref(false);
const activeIndex2 = ref("0");

const ruless = reactive({
  startTime: [{required: true, message: "开始时间不能为空", trigger: "blur"}],
  endTime: [{required: true, message: "结束时间不能为空", trigger: "blur"}],
});
const form = ref();
const formDate = reactive({startTime: "", endTime: ""});
const tiao = reactive({
  pageNum: 1,
  pageSize: 10,
  status: 0,
  postingNumber: "",
  trackingNumber: "",
});
const fchange = (e, i) => {
  tiao.pageNum = e;

  getOrderList();
};
const total = ref(0);
const getOrderList = () => {
  orderList(tiao).then((res) => {
    if (res.code == 200) {
      total.value = res.total;
      tableData.a = res.rows;
    }
  });
};
getOrderList();
const submitForm = (formEl) => {
  if (!formEl) return;
  formEl.validate((valid) => {
    if (valid) {
      tongbu(formDate).then((result) => {
        if (result.code == 200) {
          ElNotification({
            title: "提示",
            message: h("i", {style: "color: teal"}, "同步成功！"),
          });
          dialogVisible.value = false;
        }
      });
    } else {
      console.log("error submit!");
      return false;
    }
  });
};

const options = reactive({
  a: [
    {
      createBy: "admin",
      createTime: "2024-04-19 15:01:56",
      updateBy: null,
      updateTime: null,
      remark: null,
      params: {
        "@type": "java.util.HashMap",
      },
      dictCode: 213,
      dictSort: 0,
      dictLabel: "国内快递",
      dictValue: "1",
      dictType: "product_source",
      cssClass: null,
      listClass: "default",
      isDefault: "N",
      status: "0",
      default: false,
    },
  ],
});

const getlaiyuan = async () => {
  const {data} = await laiyuan();
  // options.a=data
};
let tableData = reactive({
  a: [],
});

const rules = reactive([
  {
    requiredContent: [
      {required: true, message: "必选不可为空", trigger: "blur"},
    ],
    trackingNumber: [
      {required: true, message: "条形码不可为空", trigger: "blur"},
    ],
    askFor: [{required: true, message: "要求不可为空", trigger: "blur"}],
    pdfUrl: [{required: true, message: "面单不可为空", trigger: "blur"}],

    orderProductList: [
      {
        productCount: [
          {required: true, message: "数量不能为空", trigger: "blur"},
        ],
        productSource: [
          {required: true, message: "商品来源不能为空", trigger: "blur"},
        ],
        courierNumber: [
          {required: true, message: "快递单号不能为空", trigger: "blur"},
        ],
      },
    ],
  },
]);

const kexuandata = reactive({a: [], b: []});
const getkexuan = async () => {
  const {data} = await kexuan();
  kexuandata.a = data;
};
const getbixuan = async () => {
  const {data} = await bixuan();
  kexuandata.b = data;
};

const disabled = ref(true);
const dai = reactive({a: []});
const handleSelectionChange = (data) => {
  if (data && data.length) dai.a = data;

  ludanform.length = 0;
  let item = JSON.parse(JSON.stringify(dai.a));
  xuan.length = item.length;
  if (item.length) {
    disabled.value = false;
    item.forEach((row, index) => {
      ludanform[index] = {
        id: row.id,
        askFor: row.askFor,
        pdfUrl: row.pdfUrl,
        requiredContent: row.requiredContent,
        trackingNumber: row.trackingNumber,
        postingNumber: row.postingNumber,
        totalCount: row.totalCount,
        orderProductList: row.orderProductList,
      };

      rules[index] = {
        requiredContent: [
          {required: true, message: "必选不可为空", trigger: "blur"},
        ],
        trackingNumber: [
          {required: true, message: "条形码不可为空", trigger: "blur"},
        ],
        askFor: [{required: true, message: "要求不可为空", trigger: "blur"}],
        pdfUrl: [{required: true, message: "面单不可为空", trigger: "blur"}],

        orderProductList: [
          {
            productCount: [
              {required: true, message: "数量不能为空", trigger: "blur"},
            ],
            productSource: [
              {required: true, message: "商品来源不能为空", trigger: "blur"},
            ],
            courierNumber: [
              {required: true, message: "快递单号不能为空", trigger: "blur"},
            ],
          },
        ],
      };
    });
  } else {
    disabled.value = true;
  }
};
const ludanform = reactive([
  // {
  //   orderProductList: [
  //     {
  //       name: "рюкзак для инструмента, 30*18*40cm",
  //       sku: "1431374166",
  //       productImages:
  //         "https://cdn1.ozone.ru/s3/multimedia-t/6843637109.jpg,https://cdn1.ozone.ru/s3/multimedia-p/6843637105.jpg,https://cdn1.ozone.ru/s3/multimedia-b/6843637199.jpg,https://cdn1.ozone.ru/s3/multimedia-r/6843637107.jpg,https://cdn1.ozone.ru/s3/multimedia-z/6843637115.jpg",
  //       productCount: "1",
  //       courierNumber: null,
  //       contentInspection: "",
  //       productSource: null,
  //     },
  //   ],
  // },
]);
const tianjia = () => {
  ludanform.orderProductList.push();
};
const tielts = ref("手动录单");
const xuan = reactive([]);
const ludan = (row) => {
  sancs.value = true;
  dialogVisiblex.value = true;
  getkexuan();
  getbixuan();
  getlaiyuan();
  handleSelectionChange();
  tielts.value = "合并采购";
};

const shoudoang = () => {
  tielts.value = "手动录单";
  ludanform.length = 0;
  ludanform[0] = {
    id: "",
    askFor: "",
    pdfUrl: "",
    requiredContent: "",
    trackingNumber: "",
    postingNumber: "",
    totalCount: 1,
    orderProductList: [
      {
        name: "",
        sku: "",
        productImages: "",
        productCount: "",
        contentInspection: null,
        courierNumber: null,
        productSource: null,
      },
    ],
  };

  sancs.value = true;
  dialogVisiblex.value = true;
  getkexuan();
  getbixuan();
  getlaiyuan();
};
const lufrom = ref([]);
const lusubmitForm = () => {
  let indt = 0;
  lufrom.value.forEach(async (item, index) => {
    if (!item) return;
    await item.validate((valid, fields) => {
      if (valid) {
        delete ludanform[index].orderProductList[0].updateTime;
        delete ludanform[index].orderProductList[0].createTime;
        ludanform[index].status = 2;
        gengxin({id: ludanform[index].id, status: 2}).then((res) => {});
        indt++;
      } else {
      }
    });
  });
  setTimeout(() => {
    if (indt == ludanform.length) {
      if (tielts.value == "手动录单") {
        shoucai(ludanform).then((res) => {
          if (res.code == 200) {
            disabled.value = true;
            sancs.value = false;
            getOrderList();
            ElNotification({
              title: "提示",
              message: h("i", {style: "color: teal"}, "操作成功！"),
            });
            dialogVisiblex.value = false;
          }
        });
      } else {
        cai(ludanform).then((res) => {
          if (res.code == 200) {
            disabled.value = true;
            sancs.value = false;
            getOrderList();
            ElNotification({
              title: "提示",
              message: h("i", {style: "color: teal"}, "操作成功！"),
            });
            dialogVisiblex.value = false;
          }
        });
      }
    }
  });
};
// gengxin({id: 63, status: 0}).then((res) => {});
// 草稿
const lusubmitForms = async (formEl) => {
  let indt = 0;
  lufrom.value.forEach(async (item, index) => {
    if (!item) return;
    await item.validate((valid, fields) => {
      if (valid) {
        ludanform[index].status = 1;
        delete ludanform[index].orderProductList[0].updateTime;
        delete ludanform[index].orderProductList[0].createTime;
        gengxin({id: ludanform[index].id - 0, status: 1}).then((res) => {});
        indt++;
      } else {
      }
    });
  });
  setTimeout(() => {
    if (indt == ludanform.length) {
      if (tielts.value == "手动录单") {
        shoucai(ludanform).then((res) => {
          if (res.code == 200) {
            disabled.value = true;
            sancs.value = false;
            getOrderList();
            ElNotification({
              title: "提示",
              message: h("i", {style: "color: teal"}, "操作成功！"),
            });
            dialogVisiblex.value = false;
          }
        });
      } else {
        cai(ludanform).then((res) => {
          if (res.code == 200) {
            disabled.value = true;
            sancs.value = false;
            getOrderList();
            ElNotification({
              title: "提示",
              message: h("i", {style: "color: teal"}, "操作成功！"),
            });
            dialogVisiblex.value = false;
          }
        });
      }
    }
  });
};

const dialogVisiblex = ref(false);
</script>

<template>
  <div style="">
    <header
      class="header"
      style="display: flex; justify-content: space-between"
    >
      <div
        style="
          position: relative;
          width: 99%;
          height: calc(100vh - 70px);
          background-color: #fff;
          margin: auto;
          border-radius: 10px;
        "
      >
        <div
          style="
            width: 99%;
            height: calc(100vh - 70px);
            margin: auto;
            background-color: #fff;
          "
        >
          <div style="display: flex">
            <el-menu
              style="width: 40%"
              :default-active="activeIndex2"
              class="el-menu-demo"
              mode="horizontal"
              background-color=""
              active-text-color="rgb(78 168 185)"
              @select="handleSelect"
            >
              <el-menu-item style="font-size: 12px; font-weight: 700" index="0"
                >待采购</el-menu-item
              >
              <el-menu-item style="font-size: 12px; font-weight: 700" index="1"
                >草稿</el-menu-item
              >
              <el-menu-item style="font-size: 12px; font-weight: 700" index="2"
                >待打包</el-menu-item
              >
              <el-menu-item style="font-size: 12px; font-weight: 700" index="3"
                >已打包</el-menu-item
              >
              <!-- <el-menu-item style="font-size: 12px; font-weight: 700" index="4"
                >已取消</el-menu-item
              > -->
            </el-menu>

            <div style="margin: 0 0 0; display: flex; align-items: center">
              <span style="font-size: 12px; font-weight: 700">订单号:</span>
              <el-input
                clearable
                style="width: 200px"
                v-model="tiao.postingNumber"
                :placeholder="订单号"
              />

              <span style="font-size: 12px; font-weight: 700; margin-left: 10px"
                >追踪号:
              </span>
              <el-input
                clearable
                style="width: 200px"
                v-model="tiao.trackingNumber"
                :placeholder="追踪号"
              />

              <el-button
                style="color: #fff; font-size: 12px; margin-left: 30px"
                type="primary"
                color="rgb(78 168 185)"
                round
                @click="getOrderList()"
                >查询</el-button
              >
            </div>
            <div style="width: 50px"></div>
          </div>
          <div style="display: flex; align-items: center; margin-top: 30px">
            <el-button
              style="color: #fff; font-size: 12px"
              type="primary"
              color="rgb(78 168 185)"
              round
              :disabled="disabled"
              @click="ludan"
              >合并采购</el-button
            >
            <el-button
              style="color: #fff; font-size: 12px"
              type="primary"
              color="rgb(78 168 185)"
              round
              @click="shoudoang"
              >手动录单</el-button
            >
            <el-button
              style="
                color: #fff;

                font-size: 12px;
                margin-left: 30px;
              "
              type="primary"
              color="rgb(78 168 185)"
              round
              @click="dialogVisible = true"
              >同步数据</el-button
            >

            <span style="font-size: 12px; margin-left: 30px; font-weight: 700"
              >物流单号:
              <el-select
                clearable
                v-model="danhao"
                placeholder="选择物流类型"
                style="width: 240px"
              >
                <el-option
                  v-for="item in danOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </span>
            <div style="font-size: 12px; margin-left: 30px; font-weight: 700">
              单号：
              <el-input
                clearable
                :disabled="!danhao"
                style="width: 200px; margin-left: 10px"
                v-model="wulu"
                :placeholder="物流单号"
              />
              <el-button
                style="color: #fff; font-size: 12px; margin-left: 30px"
                type="primary"
                color="rgb(78 168 185)"
                round
                @click="dangetOrderList()"
                >查询</el-button
              >
            </div>
          </div>

          <div style="margin-top: 10px">
            <div></div>
            <el-table
              style="height: calc(100vh - 250px); overflow-y: scroll"
              @sort-change="pai"
              header-row-class-name="tableRowClassName"
              :data="tableData.a"
              @selection-change="handleSelectionChange"
              :default-sort="{prop: 'date', order: 'descending'}"
            >
              <el-table-column
                v-if="tiao.status == 0 || tiao.status == 1"
                type="selection"
                width="35"
              />

              <el-table-column
                align="center"
                prop="name"
                label="图片"
                width="150"
              >
                <template #default="scope">
                  <div style="z-index: inherit" class="demo-image__preview">
                    <el-image
                      style="width: 150px; height: 150px"
                      :src="
                        scope.row.orderProductList[0].productImages.split(
                          ','
                        )[0]
                      "
                      :zoom-rate="1.2"
                      :max-scale="7"
                      :z-index="9999999999"
                      :min-scale="0.2"
                      :preview-src-list="
                        scope.row.orderProductList[0].productImages.split(',')
                      "
                      :initial-index="4"
                      fit="cover"
                      :preview-teleported="true"
                      :teleported="true"
                    />
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="postingNumber"
                label="商品信息"
                width="280"
              >
                <template #default="scope">
                  <span style="color: rgb(78 168 185)">{{
                    scope.row.orderProductList[0].name
                  }}</span>
                  <br />
                  <span> sku: {{ scope.row.orderProductList[0].sku }}</span>
                  <br />
                  <span>
                    数量: *{{
                      scope.row.orderProductList[0].productCount
                    }}</span
                  >
                  <br />
                  <span> 单价: </span>
                </template>
              </el-table-column>
              <el-table-column prop="count" width="150" label="订单号">
                <template #default="scope">
                  <span style="font-weight: 700">
                    {{ scope.row.postingNumber }}</span
                  >
                </template>
              </el-table-column>

              <el-table-column prop="cutOffTime" width="250" label="物流,数量">
                <template #default="scope">
                  <span> 物流: {{ scope.row.logistics }}</span>
                  <br />

                  <span> 总价: {{ scope.row.totalPrices }}</span>
                  <br />
                  <span> 店铺: {{ scope.row.shopName }}</span>
                  <br />
                  <span> 总数: {{ scope.row.totalCount }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="avgCountItems" label="状态">
                <template #default="scope">
                  <span
                    style="color: red; font-weight: 700"
                    v-if="scope.row.status == 0"
                  >
                    待采购
                  </span>
                  <span v-if="scope.row.status == 1" style="font-weight: 700">
                    草稿
                  </span>
                  <span style="font-weight: 700" v-if="scope.row.status == 2">
                    待打包
                  </span>
                  <span style="font-weight: 700" v-if="scope.row.status == 3">
                    已打包
                  </span>
                </template>
              </el-table-column>
              <el-table-column prop="itemsViews" label="追踪号码">
                <template #default="scope">
                  <span style="font-weight: 700"></span>

                  {{ scope.row.trackingNumber }}
                  <br />
                </template>
              </el-table-column>
              <el-table-column prop="itemsViews" label="国内快递单号">
                <template #default="scope">
                  <span style="font-weight: 700"></span>

                  {{ scope.row.trackingNumber }}
                  <br />
                </template>
              </el-table-column>
              <el-table-column prop="itemsViews" label="时间详情">
                <template #default="scope">
                  <span> 买家下单时间: {{ scope.row.orderTime }}</span>

                  <br />
                  <span> 截止出货时间: {{ scope.row.cutOffTime }}</span>

                  <br />
                  <span> 取消时间: {{ scope.row.cancelTime }}</span>

                  <br />
                </template>
              </el-table-column>
            </el-table>
            <div
              style="margin-top: 10px; display: flex; justify-content: center"
            >
              <el-pagination
                :total="total"
                background
                @change="fchange"
                :page-size="tiao.pageSize"
                layout="prev, pager, next"
              />
            </div>
          </div>
        </div>
      </div>
    </header>

    <el-dialog v-model="dialogVisible" title="同步数据" width="500">
      <el-form
        label-position="top"
        ref="form"
        :model="formDate"
        :rules="ruless"
        label-width="80px"
      >
        <el-form-item label="标题" prop="startTime">
          <template #label>
            <span style="font-size: 12px; font-weight: 700; color: #000">
              开始时间<i class="el-icon-question"></i
            ></span>
          </template>
          <el-date-picker
            v-model="formDate.startTime"
            type="date"
            value-format="YYYY-MM-DD"
            placeholder="选择开始时间"
          />
        </el-form-item>
        <el-form-item label="内容" prop="endTime">
          <template #label>
            <span style="font-size: 12px; font-weight: 700; color: #000">
              结束时间 <i class="el-icon-question"></i
            ></span>
          </template>
          <el-date-picker
            v-model="formDate.endTime"
            type="date"
            value-format="YYYY-MM-DD"
            placeholder="选择结束时间"
          />
        </el-form-item>
        <el-form-item>
          <p style="text-align: center; width: 100%">
            <el-button
              style="margin-top: 30px; color: #fff; font-size: 12px"
              type="primary"
              color="rgb(78 168 185)"
              round
              @click="submitForm(form)"
              >同步数据</el-button
            >
          </p>
        </el-form-item>
      </el-form>
      <template #footer> </template>
    </el-dialog>

    <div>
      <el-dialog
        v-model="dialogVisiblex"
        :title="tielts"
        width="98%"
        :before-close="handleClose"
      >
        <div v-if="sancs">
          <div v-for="(zonda, ind) in ludanform" :key="ind">
            <el-form
              :rules="rules[ind]"
              :model="zonda"
              ref="lufrom"
              label-width="auto"
            >
              <ul class="nu" style="display: flex">
                <li>
                  <p class="title">服务</p>
                  <div style="margin-top: 10px">
                    <el-form-item
                      label="必选服务"
                      prop="requiredContent"
                      :rules="[
                        {
                          required: true,
                          message: '必选服务不可为空',
                          trigger: 'change',
                        },
                      ]"
                    >
                      <!-- <el-checkbox-group v-model="ludanform.requiredContent">
                  <el-checkbox
                    v-for="item in kexuandata.b"
                    :key="item.dictValue"
                    :value="item.dictValue"
                    name="type"
                  >
                    {{ item.dictLabel }}
                  </el-checkbox>
                </el-checkbox-group> -->
                      <el-radio-group v-model="zonda.requiredContent">
                        <el-radio
                          v-for="item in kexuandata.b"
                          :key="item.dictValue"
                          :value="item.dictValue"
                          >{{ item.dictLabel }}</el-radio
                        >
                      </el-radio-group>
                    </el-form-item>
                    <el-form-item label="可选服务">
                      <el-checkbox-group
                        @change="
                          () => {
                            zonda.choosableContent = xuan[ind].join(',');
                            console.log(zonda.choosableContent);
                          }
                        "
                        v-model="xuan[ind]"
                      >
                        <el-checkbox
                          v-for="item in kexuandata.a"
                          :key="item.dictValue"
                          :value="item.dictValue"
                          name="type"
                        >
                          {{ item.dictLabel }}
                        </el-checkbox>
                      </el-checkbox-group>
                    </el-form-item>
                    <el-form-item prop="askFor" label="要求">
                      <el-input
                        v-model="zonda.askFor"
                        style="width: 240px"
                        :autosize="{minRows: 2, maxRows: 2}"
                        type="textarea"
                        placeholder="打包要求，尺寸，重量等"
                    /></el-form-item>
                  </div>
                </li>
                <li>
                  <p class="title">国际订单</p>

                  <div style="margin-top: 10px">
                    <el-form-item label="订单编号">
                      <el-input
                        style="width: 200px"
                        v-model="zonda.postingNumber"
                        placeholder="请填写订单编号"
                      />
                    </el-form-item>

                    <el-form-item prop="trackingNumber" label="条形码">
                      <el-input
                        style="width: 200px"
                        v-model="zonda.trackingNumber"
                        placeholder="请填写条形码"
                      />
                    </el-form-item>

                    <el-form-item prop="pdfUrl" label="国际面单">
                      <fileupload
                        @shan="
                          () => {
                            zonda.pdfUrl = '';
                          }
                        "
                        :limit="1"
                        :value="zonda.pdfUrl"
                        @und="
                          (e) => {
                            zonda.pdfUrl = e.url;
                          }
                        "
                        :fileType="['pdf']"
                      />
                    </el-form-item>
                  </div>
                </li>
                <li style="width: 40%">
                  <p class="title">商品信息</p>
                  <div style="margin-top: 10px">
                    <el-form-item label="商品图片">
                      <tuchuan
                        :ind="ind"
                        :value="zonda.orderProductList[0].productImages"
                        @und="
                          (e) => {
                            zonda.orderProductList[0].productImages =
                              (zonda.orderProductList[0].productImages
                                ? zonda.orderProductList[0].productImages + ','
                                : '') + e.url;
                          }
                        "
                        @shan="shan"
                      />
                    </el-form-item>
                    <el-form-item
                      prop="orderProductList[0].productCount"
                      label="商品数量"
                    >
                      <el-input
                        placeholder="商品数量"
                        v-model="zonda.orderProductList[0].productCount"
                      />
                    </el-form-item>
                    <el-form-item label="商品描述">
                      <el-input
                        v-model="zonda.orderProductList[0].contentInspection"
                        style="width: 240px"
                        :autosize="{minRows: 4, maxRows: 6}"
                        type="textarea"
                        placeholder="1、请明确验货内容，打包只核验文字!2、图片仅作为参考，，大致核对无误即打包 正确示范:萧
                  色 M码 高陨鞋 货号:8987错误示范：只给图片不插述验货内容、非通用简写、岐义等"
                    /></el-form-item>
                    <!-- <el-button
                style="
                  color: #fff;
                  font-size: 12px;
                  margin-left: 30px;
                  height: 25px;
                "
                type="primary"
                color="rgb(78 168 185)"
                round
                @click="tianjia"
                >添加商品（一单多品）</el-button
              > -->
                  </div>
                </li>
                <li>
                  <p class="title">打包来源</p>
                  <div style="margin-top: 10px">
                    <el-form-item
                      prop="orderProductList[0].productSource"
                      label="商品来源"
                    >
                      <el-select
                        v-model="zonda.orderProductList[0].productSource"
                        placeholder="请选择商品来源"
                        style="width: 200px"
                      >
                        <el-option
                          v-for="item in options.a"
                          :key="item.value"
                          :label="item.dictLabel"
                          :value="item.dictValue"
                        />
                      </el-select>
                    </el-form-item>
                    <el-form-item
                      prop="orderProductList[0].courierNumber"
                      label="快递单号"
                    >
                      <el-input
                        style="width: 200px"
                        v-model="zonda.orderProductList[0].courierNumber"
                        placeholder="请填写快递单号"
                      />
                    </el-form-item>
                  </div>
                </li>
              </ul>
            </el-form>
          </div>
        </div>

        <template #footer> </template>
        <div style="width: 100%; text-align: center">
          <el-button
            style="color: #fff; font-size: 12px; margin-left: 30px"
            type="primary"
            color="rgb(78 168 185)"
            round
            @click="lusubmitForms(lufrom)"
            >保存草稿</el-button
          >
          <el-button
            style="color: #fff; font-size: 12px; margin-left: 30px"
            type="primary"
            color="rgb(78 168 185)"
            round
            @click="lusubmitForm(ind)"
            >预报订单</el-button
          >
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<style scoped lang="scss">
.nu {
  width: 100%;
  li {
    width: 25%;

    text-align: center;
    .title {
      font-weight: 700;
      margin-bottom: 20px;
    }
  }
}

.header {
  width: 100%;
}

:deep(.tableRowClassName .el-table__cell.is-leaf) {
  background: #eeeff3 !important;
  color: #000 !important;
}
.setSuccess {
  background: green !important;
  color: white !important;
}
.setHeight {
  color: blue !important;
}
</style>
